<template>
  <div>
    我提交的工单:

    <div
      v-for="item in instance"
      :key="item.id"
    >
      工单状态:{{inst_status(item.id)}}
      创建时间:{{item.c_time}} <br>
      工单内容:
      <div
        v-for="field in item.content"
        :key="field.label"
      >
        <label>{{field.label}}:</label> <span>{{field.value}}</span>
      </div>
      审批人列表:
      <div
        v-for="f in item.flow"
        :key="f.id"
      >
        审批人: {{f.user.username}} <br>
        审批状态:{{f.status | status_str}} <br>
        意见: {{f.comment}}
      </div>
    </div>

  </div>
</template>

<script>
import Axios from 'axios'
export default {
  data() {
    return {
      token: localStorage.token || '',
      uid: localStorage.uid || '',
      instance: {},

    }
  },
  created() {
    this.get_instance()
  },
  methods: {
    inst_status(inst_id) {
      var the = this.instance.find(item => item.id == inst_id)
      // debugger
      var ok_num = the.flow.filter(item => item.status == 1).length
      if (the.flow.length == ok_num) {
        return "审批完成"
      }
      var no_num = the.flow.filter(item => item.status == 2).length
      if(no_num>0){
        return "申请被拒绝"
      }
      return "未完成"
    },
    get_instance() {
      Axios.get('/tempinstance/?user=' + this.uid, {
        headers: {
          Authorization: 'JWT ' + this.token
        }
      }).then(resp => {
        console.log(resp)
        // debugger
        this.instance = resp.data
        // 内容 json 转成 对象
        this.instance.map(item => {
          item.content = JSON.parse(item.content)
        })
        // this.instance.content = JSON.parse(this.instance.content)
        // console.log(this.instance.content)
      })
    }
  },
  filters: {
    status_str(value) {
      var d = {
        0: '未处理',
        1: '同意',
        2: '不同意'
      }
      return d[value]
    }
  }
}
</script>

<style>
</style>